
<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<!DOCTYPE HTML>
<html>
<head>
    <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" href="css/login.css"/>
    <title>EasyMall欢迎您登陆</title>
    <script type="application/javascript" src="<%=request.getContextPath()%>/js/jquery-1.4.2.js"></script>
    <script type="application/javascript">
        function setMsg(id,msg) {
            document.getElementById(id+"_msg").innerText=msg;
        }

        function checkNull(name,msg) {
            setMsg(name,"")
            const v = document.getElementsByName(name)[0].value;
            if(v == null || v===""){
                setMsg(name,msg)
                return false;
            }
            return true;
        }

        function checkForm() {
            //用户名不能为空的校验
            var username=document.getElementsByName("username")[0].value;
             if(username == null || username == ""){
                 //alert("用户名不能为空")
                 //document.getElementById("username_msg").innerText="用户名不能为空!"
                 setMsg("username","用户名不能为空")
             }

             var password=document.getElementsByName("password")[0].value;
             if(password == null || password == ""){
                 setMsg("password","密码不能为空")
             }


        }

        function checkName(){
            //检查是否为空
            var isNotNull=checkNull('username','用户名不能为空');
            //不为空的时候校验
            if (isNotNull){
                var username=document.getElementsByName("username")[0].value;
                //AJAX异步检查用户名是否存在
                $.get("<%=request.getContextPath()%>/Servlet/AjaxHasUsernameServlet",{"username":username},function (data){
                    alert(data);
                })
            }
        }

    </script>
</head>
<body>
<h1>欢迎登陆EasyMall</h1>
<form action="${pageContext.request.contextPath}/servlet/LoginServlet" method="POST">
    <table>
        <tr>
            <td colspan="2" style="color: red;text-align: center">
                <%=request.getAttribute("msg")==null ? "":request.getAttribute("msg")%>
            </td>
        </tr>
        <tr>
        <td class="tdx">用户名：</td>
        <td>
            <input type="text" name="username" value="<%=request.getParameter("username")==null?"":request.getParameter("username")%>" onblur="checkNull('username','用户名不能为空')">
            <span style="color: red" id="username_msg"></span>
        </td>
        </tr>
        <tr>
            <td class="tdx">密码：</td>
            <td>
                <input type="password" name="password" onblur="checkNull('password','密码不能为空')">
                <span style="color: red" id="password_msg"></span>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <input type="checkbox" name="remname" value="true"/>记住用户名
                <input type="checkbox" name="autologin" value="true"/><a href="update.jsp">修改密码</a>
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <input type="submit" value="登陆"/>
            </td>
        </tr>
    </table>
</form>
</body>
</html>

